<script>
import { onMounted, onBeforeUnmount } from 'vue'
import { scene, camera, renderer, loopCallbacks, hideLoading } from './core/init.js'
import { FishingManager } from './game/FishingManager.js'
import { FishingUI } from './ui/FishingUI.js'

export default {
  name: 'App',
  setup() {
    let fishingManager = null
    let fishingUI = null
    
    onMounted(async () => {
      try {
        console.log('🎣 启动VR钓鱼游戏...')
        
        // 初始化UI系统
        fishingUI = new FishingUI()
        
        // 初始化钓鱼管理器
        fishingManager = new FishingManager(scene, camera, fishingUI)
        
        // 注册更新循环
        loopCallbacks.push((deltaTime, waterTime) => {
          fishingManager.update(deltaTime)
        })
        
        // 隐藏加载界面
        setTimeout(() => {
          hideLoading()
        }, 2000)
        
        console.log('✅ VR钓鱼游戏启动完成')
        
      } catch (error) {
        console.error('❌ 游戏启动失败:', error)
      }
    })
    
    onBeforeUnmount(() => {
      // 清理资源
      if (fishingManager) {
        fishingManager.destroy()
      }
      if (fishingUI) {
        fishingUI.destroy()
      }
    })
    
    return {}
  }
}
</script>

<template>
  <div id="app">
    <!-- Three.js 渲染器会插入到这里 -->
  </div>
</template>

<style>
#app {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  position: relative;
}

/* 全局样式重置 */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: 'Microsoft YaHei', Arial, sans-serif;
  overflow: hidden;
}
</style>
